import { defineStore } from "pinia";
import { io } from "socket.io-client";
import serverUrl from "../config/config";
import router from "../router";

import { useUserStore } from "./user";

const gamestatus = defineStore("gamestatus", {
	state: () => ({
		socket: null,
		sid: null,
		gridStatus: null,
		myAction: true,
		wait: false,
		rooms: [],
		myRoomId: null,
		gameStart: false,
		winner: null,
		chat: [],
		isWithPlay: {},
		players: [],
	}),
	actions: {
		init() {
			if (this.socket) return; // 防止重复初始化
			this.socket = io(serverUrl.serverUrl);
			console.log("初始化游戏");

			// this.gridStatus = Array.from({ length: 225 }, () => ({ clicked: false, color: null }));
			this.socket.on("connect", () => {
				this.sid = this.socket.id;
				console.log(this.sid + " 已连接");
				let userStore = useUserStore();
				this.socket.emit("firstConn", { userId: userStore.user.userId, userName: userStore.user.username, sid: this.sid });
			});
			this.socket.on("disconnect", () => {
				this.sid = null;
				// this.gridStatus = Array.from({ length: 225 }, () => ({ clicked: false, color: null }));
				this.myRoomId = null;
				console.log(this.sid + " 已断开");
			});
			this.socket.on("makeMove", (data) => {
				console.log(data);
				this.toggleGridColor(data.index, data.color);
			});
			this.socket.on("sendRoom", (data) => {
				this.rooms = data;
				// console.log(this.rooms);
			});
			this.socket.on("sendPlayer", (data) => {
				this.players = data;
				console.log(data);
			});
			this.socket.on("joinRoom", (data) => {
				let { roomId, color, gridStatus, chat } = data;
				console.log(data);
				this.gridStatus = gridStatus;
				this.myAction = true;
				this.chat = chat;
				if (color == "black") {
					this.myAction = true;
					console.log(color, "true");
				} else {
					this.myAction = false;
					console.log(color, "false");
				}

				this.myRoomId = roomId;
				this.winner = null;
				console.log(`加入房间 ${roomId} 成功`);
				router.push("/board");
			});

			this.socket.on("assignedColor", (data) => {
				console.log(data);
				if (data == "black") {
					return;
				} else {
					this.myAction = false;
				}
			});
			this.socket.on("gameStart", () => {
				console.log("gameStart");
				this.gameStart = true;
			});
			this.socket.on("gameOver", (data) => {
				let { winner, arr } = data;
				this.gameStart = false;
				this.winner = winner;
				console.log(arr);
			});
			this.socket.on("chat", (data) => {
				let { userId, msg } = data;
				console.log(data);
				this.chat.push(data);
			});
			this.socket.on("createHideRoom", (data) => {
				let userStore = useUserStore();
				let {roomId}=data;
				console.log('加入隐藏房间',{ roomId: roomId, sid: this.sid,userId:userStore.user.userId });
				this.socket.emit("joinRoom", { roomId: roomId, sid: this.sid,userId:userStore.user.userId });
			});
			this.socket.on("withPlay", (data) => {
				let {roomId,userName}=data;
				this.isWithPlay={roomId,userName};
				// console.log('被邀请加入房间',{ roomId: roomId, sid: this.sid ,userName:userName });
			});
		},
		toggleGridColor(index, color) {
			this.myAction = !this.myAction;
			this.gridStatus[index].clicked = true;
			this.gridStatus[index].color = color;
			this.wait = false;
		},
	},
	persist: true,
});
export default gamestatus;
